@charset "utf-8";
/*图片放大*/
.imgs { display: block; -m oz-transition: .3s ease-in;
-webkit-transition: .3s ease-in; -o-transition: .3s ease-in; -ms-transition: .3s ease-in; transition: .3s ease-in; }
a:hover .imgs { transform: scale(1.5, 1.5); -moz-transform: scale(1.5, 1.5); -webkit-transform: scale(1.5, 1.5); -o-transform: scale(1.1, 1.1); }

/*产品动画*/
@-webkit-keyframes hover { 50% {
 -webkit-transform: translateY(-3px);
 transform: translateY(-3px);
}
 100% {
 -webkit-transform: translateY(-6px);
 transform: translateY(-6px);
}
}
 @keyframes hover { 50% {
 -webkit-transform: translateY(-3px);
 transform: translateY(-3px);
}
 100% {
 -webkit-transform: translateY(-6px);
 transform: translateY(-6px);
}
}
 @-webkit-keyframes hover-shadow { 0% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
 opacity: .4;
}
 50% {
 -webkit-transform: translateY(3px);
 transform: translateY(3px);
 opacity: 1;
}
 100% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
 opacity: .4;
}
}
 @keyframes hover-shadow { 0% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
 opacity: .4;
}
 50% {
 -webkit-transform: translateY(3px);
 transform: translateY(3px);
 opacity: 1;
}
 100% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
 opacity: .4;
}
}
.hover-shadow { display: inline-block; position: relative; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform; transition-property: transform; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.hover-shadow:before { pointer-events: none; position: absolute; z-index: -1; content: ''; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 0; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); /* W3C */ -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform, opacity; transition-property: transform, opacity; }
.hover-shadow:hover, .hover-shadow:focus, .hover-shadow:active { -webkit-transform: translateY(-6px); transform: translateY(-6px); -webkit-animation-name: hover; animation-name: hover; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }
.hover-shadow:hover:before, .hover-shadow:focus:before, .hover-shadow:active:before { opacity: .4; -webkit-transform: translateY(6px); transform: translateY(6px); -webkit-animation-name: hover-shadow; animation-name: hover-shadow; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }
/* title */
.link--mallki { font-size: 30px; font-weight: bolder; color: #005baa; -webkit-transition: color 0.5s 0.25s; transition: color 0.5s 0.25s; overflow: hidden; position: relative; outline: none; display: inline-block; }
.link--mallki:hover { -webkit-transition: none; transition: none; color: transparent; }
.link--mallki::before { content: ''; width: 100%; height: 6px; margin: -3px 0 0 0; background: #f1942e; position: absolute; left: 0; top: 50%; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-transition: -webkit-transform 0.4s; transition: transform 0.4s; -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); }
.link--mallki:hover::before { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
.link--mallki span { position: absolute; height: 50%; width: 100%; left: 0; top: 0; overflow: hidden; }
.link--mallki span::before { content: attr(data-letters); color: red; position: absolute; left: 0; width: 100%; color: #f1942e; -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; }
.link--mallki span:nth-child(2) { top: 50%; }
.link--mallki span:first-child::before { top: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
.link--mallki span:nth-child(2)::before { bottom: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
.link--mallki:hover span::before { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
/* more */
.button--winona { vertical-align: middle; position: relative; z-index: 1; -webkit-backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; overflow: hidden; padding: 0; -webkit-transition: border-color 0.3s, background-color 0.3s; transition: border-color 0.3s, background-color 0.3s; -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
.button--winona::after { content: attr(data-text); position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; color: #FFF; -webkit-transform: translate3d(0, 25%, 0); transform: translate3d(0, 25%, 0); }
.button--winona > span { display: block; }
.button--winona::after, .button--winona > span { padding: 0 0; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s; -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
.button--winona:hover { border-color: #FFF; background-color: #f1942e; padding: 0 10px; }
.button--winona:hover::after { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.button--winona:hover > span { opacity: 0; -webkit-transform: translate3d(0, -25%, 0); transform: translate3d(0, -25%, 0); }
/* aboutlist */

.list_ov { position: relative; }
.list_ov .lista { display: block; transition: all .6s ease-out; width: 100%; height: 100%; }
.list_ov .listb { position: absolute; top: 0; opacity: 0; transform: rotateY(180deg); transition: all .6s ease-out; width: 100%; height: 100%; display: block; }
.list_ov:hover .lista { transition: all .6s ease-out; transform: rotateY(180deg); opacity: 0; }
.list_ov:hover .listb { transition: all .6s ease-out; transform: rotateY(360deg); opacity: 1; }

/* 简介图片 */
@-webkit-keyframes hang { 50% {
 -webkit-transform: translateY(3px);
 transform: translateY(3px);
}
 100% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
}
}
 @keyframes hang { 50% {
 -webkit-transform: translateY(3px);
 transform: translateY(3px);
}
 100% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
}
}
.hang { display: inline-block; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-property: transform; transition-property: transform; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.hang:hover, .hang:focus, .hang:active { -webkit-transform: translateY(6px); transform: translateY(6px); -webkit-animation-name: hang; animation-name: hang; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }


/* 新闻图片 */
@-webkit-keyframes wobble-vertical { 16.65% {
 -webkit-transform: translateY(8px);
 transform: translateY(8px);
}
 33.3% {
 -webkit-transform: translateY(-6px);
 transform: translateY(-6px);
}
 49.95% {
 -webkit-transform: translateY(4px);
 transform: translateY(4px);
}
 66.6% {
 -webkit-transform: translateY(-2px);
 transform: translateY(-2px);
}
 83.25% {
 -webkit-transform: translateY(1px);
 transform: translateY(1px);
}
 100% {
 -webkit-transform: translateY(0);
 transform: translateY(0);
}
}
 @keyframes wobble-vertical { 16.65% {
 -webkit-transform: translateY(8px);
 transform: translateY(8px);
}
 33.3% {
 -webkit-transform: translateY(-6px);
 transform: translateY(-6px);
}
 49.95% {
 -webkit-transform: translateY(4px);
 transform: translateY(4px);
}
 66.6% {
 -webkit-transform: translateY(-2px);
 transform: translateY(-2px);
}
 83.25% {
 -webkit-transform: translateY(1px);
 transform: translateY(1px);
}
 100% {
 -webkit-transform: translateY(0);
 transform: translateY(0);
}
}
.wobble-vertical { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.wobble-vertical:hover, .wobble-vertical:focus, .wobble-vertical:active { -webkit-animation-name: wobble-vertical; animation-name: wobble-vertical; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; }
/*合作动画*/
.tanc { webkit-transition: all 0.15s ease-in; -moz-transition: all 0.15s ease-in; -ms-transition: all 0.15s ease-in; transition: all 0.15s ease-in; }
.tanc:hover { -webkit-transform: scale(1.2) translateY(-20px); -moz-transform: scale(1.2) translateY(-20px); -ms-transform: scale(1.2) translateY(-20px); transform: scale(1.2) translateY(-20px); -webkit-box-shadow: 0 10px 35px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 10px 35px rgba(0, 0, 0, 0.3); box-shadow: 0 10px 35px rgba(0, 0, 0, 0.3); }